
var lastMarker;
var point = 0;
var map;
var defaultCenter = new google.maps.LatLng(60, 24);
var defaultZoom = 8;
var closeZoom = 13;

function initialize() {
    var myOptions = {
      zoom: defaultZoom,
      center: defaultCenter,
      mapTypeId: google.maps.MapTypeId.SATELLITE
    };
    
    map = new google.maps.Map(document.getElementById("map_canvas"),
                              myOptions);
    google.maps.event.addListener(map, 'click', function(e) {
            var marker;
            var linePoints;
            var polyline;
            if (point == 0) {
                marker = new MarkerWithLabel({
                      position: e.latLng, 
                      map: map,
                      raiseOnDrag: false,
                      icon: "http://labs.google.com/ridefinder/images/mm_20_red.png",
                      draggable: true,
                      flat: true,
                      labelContent: "",
                      labelAnchor: new google.maps.Point(22, 0),
                      labelClass: "labels", // the CSS class for the label
                      labelStyle: {opacity: 0.6}
                    });
                linePoints = new Array();
                linePoints[0] = linePoints[1] = e.latLng;
                polyline = new google.maps.Polyline({
                      map: map,
                      clickable: false,
		      strokeColor: "red",
                      path: linePoints,
                      geodesic: true});
            } else {
                marker = new google.maps.Marker({
                      position: e.latLng, 
                      map: map,
                      draggable: true,
                      flat: true,
                      icon: "http://labs.google.com/ridefinder/images/mm_20_red.png",
                      raiseOnDrag: false
                    });
                linePoints = lastMarker.get('linePoints');
                polyline = lastMarker.get('polyline');
                linePoints[1] = e.latLng;
                polyline.setPath(linePoints);
                marker.set('firstMark', lastMarker);
            }
            marker.set('index', point);
            marker.set('polyline', polyline);
            marker.set('linePoints', linePoints);
            point = 1 - point;
            lastMarker = marker;
            google.maps.event.addListener(marker, 'drag', function(e) {
                    var linePoints = marker.get('linePoints');
                    var polyline = marker.get('polyline');
                    var index = marker.get('index');
                    linePoints[index] = e.latLng;
                    polyline.setPath(linePoints);
                    var firstMark;
                    if (index == 1) {
                        firstMark = marker.get('firstMark');
                    } else {
                        firstMark = marker;
                    }
                    updateLabel(firstMark);
                });

            google.maps.event.addListener(map, 'mousemove', function(e) {
                    if (point == 1) {
                        var linePoints = lastMarker.get('linePoints');
                        var polyline = lastMarker.get('polyline');
                        linePoints[1] = e.latLng;
                        polyline.setPath(linePoints);	
                        updateLabel(lastMarker);
                    }
                });
        });

    document.getElementById('spot').value = 0;

    google.maps.event.addListener(map, 'rightclick', function(e) {
	map.setZoom(map.getZoom() + 1);
	map.setCenter(e.latLng);
        });

}

function zoomToSpot(val)
{
    if (val == "0") {
        map.setZoom(defaultZoom);
        map.panTo(defaultCenter);
    } else {
        var latLngVals = val.split('/');
        map.panTo(new google.maps.LatLng(latLngVals[0], latLngVals[1]));
        map.setZoom(closeZoom);
    }
}

function updateLabel(marker) 
{
    var points = marker.get('linePoints');
    var dist = google.maps.geometry.spherical.computeDistanceBetween(points[0], points[1]);
    var heading = google.maps.geometry.spherical.computeHeading(points[0], points[1]);
    if (heading < 0) {
        heading += 360;
    }
    marker.setOptions({labelContent: formatDistance(dist)+"<br/>" + round(heading, 0) + "&deg;"});
}

function formatDistance(d) 
{
    var unit;
    var r;
    var unitDiv;
    
    if (d < 10) {
        unit="m";
        r = 0;
        unitDiv = 1;
    } else if (d < 1000) {
        unit="m";
        r = 0;
        unitDiv = 1;
    } else if (d < 10000) {
        unit="km";
        r = 1;
        unitDiv = 1000;
    } else {
        unit="km";
        r = 0;
        unitDiv = 1000;
    }
    return round(d/unitDiv,r)+unit;
}

function round(v, dec) { // to number of decimals
    v = Math.round(v * Math.pow(10,dec)) / Math.pow(10,dec);
    return v;
}
